import {
  ModalForm,
  ProForm,
  ProFormDatePicker,
  ProFormMoney,
  ProFormTextArea
} from "@ant-design/pro-components";
import { message } from "antd";
import React, { useState, useEffect } from "react";
import { useIntl } from "umi";
import { CustomerAddressVo } from "../../constants"
import CustomerSelect from "../../Payment/components/CustomerSelect";
import UploadButton from "@/components/UploadButton";
import { createCredit } from "@/services/payment/credit_api";



interface CreateModalProps {
  visible: boolean;
  values?: CustomerAddressVo;
  onCancel: () => void;
  onSuccess: () => void;
}
const formItemLayout = {
  labelCol: { span: 6 },
  wrapperCol: { span: 14 },
};
const AddForm: React.FC<CreateModalProps> = ({
  visible,
  values,
  onCancel,
  onSuccess,
}) => {
  const [form] = ProForm.useForm<CustomerAddressVo>();
  const intl = useIntl();
  const [validPeriodDateFor, setValidPeriodDateFor] = useState<string>('');
  const [validPeriodDateTo, setValidPeriodDateTo] = useState<string>('');
  // const [updateStatus, setUpdateStatus] = useState<boolean>(false);
  const [editStatus, setEditStatus] = useState<boolean>(false);




  const handleSubmit = async (formValues: CustomerAddressVo) => {

    try {
      // API调用逻辑
      const response = await createCredit(formValues);

      if (response.code != 0) {
        if (!response.msg) {
          throw new Error(intl.formatMessage({ id: "request.error.operating" }));
        } else {
          // throw new Error(response.msg);
          message.error(response.msg);
          return false;
        }
      }
      message.success(intl.formatMessage({ id: "request.success.operating" }));
      onSuccess();
      form.resetFields();
      return true;
    } catch (error) {
      message.error(intl.formatMessage({ id: "request.error.retry" }));
      return false;
    }
  };


  return (
    <ModalForm<CustomerAddressVo>
      title={intl.formatMessage({ id: 'pages.customer.credit.add.title' })}
      width="40%"
      form={form}
      open={visible}
      onOpenChange={(visible) => !visible && onCancel()}
      onFinish={handleSubmit}
      autoFocusFirstInput
      modalProps={{
        destroyOnClose: true,
        maskClosable: false,
      }}
      submitter={{
        searchConfig: {
          submitText: intl.formatMessage({ id: "pages.button.submit" }),
          resetText: intl.formatMessage({ id: "pages.button.cancel" }),
        },
      }}
      layout="horizontal"
      {...formItemLayout}
    >
      <CustomerSelect 
       label = {intl.formatMessage({ id: 'pages.customer.select.label' })}
       placeholder = {intl.formatMessage({ id: 'pages.customer.select.placeholder' })}
       rules ={ [{ required: true, message: intl.formatMessage({ id: 'pages.customer.select.required' }) }] }
       />
      <ProFormMoney
        label={intl.formatMessage({ id: 'pages.customer.credit.amount.label' })}
        name="creditAmount"
        fieldProps={{
          moneySymbol: false,
        }}
        placeholder={intl.formatMessage({ id: 'pages.customer.credit.amount.placeholder' })}
        min={0}
        width="lg"
      />

      <ProFormDatePicker
        name="dueTime"
        label={intl.formatMessage({ id: 'pages.customer.credit.dueDate.label' })}
      />
      <ProFormTextArea
        name="remark"
        label={intl.formatMessage({ id: 'pages.common.remark.label' })}
        row={3}
        placeholder={intl.formatMessage({ id: 'pages.common.input.placeholder' })}
      />
      <UploadButton
        name="attachment"
        label={intl.formatMessage({ id: 'pages.customer.credit.document.label' })}
        form={form}
        initialValue={values?.creditAttachment}
        action="/admin-api/infra/file/upload"
        bizType="credit_attachments"
      />
    </ModalForm>
  );
};

export default AddForm;
